<template>
  <div class="container">
    <div id="he-plugin-simple"></div>
  </div>
</template>

<script>
export default {
  created() {
    window.WIDGET = {
      CONFIG: {
        modules: "01234",
        background: 5,
        tmpColor: "6BCBFF",
        tmpSize: 16,
        cityColor: "6BCBFF",
        citySize: 16,
        aqiSize: 16,
        weatherIconSize: 24,
        alertIconSize: 18,
        padding: "0px 10px 0px 10px",
        shadow: "1",
        language: "auto",
        borderRadius: 5,
        fixed: "false",
        vertical: "middle",
        horizontal: "center",
        key: "86061b5c0df34a98818ccf5ad31b9151",
      },
    };
    (function (d) {
      var c = d.createElement("link");
      c.rel = "stylesheet";
      c.type = "text/plain";
      c.href =
        "https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0";
      var s = d.createElement("script");
      s.src =
        "https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0";
      var sn = d.getElementsByTagName("script")[0];
      sn.parentNode.insertBefore(s, sn);
      sn.parentNode.insertBefore(c, sn);
    })(document);
  },
};
</script>
<style lang="scss" scoped>
.container {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
</style>
